<template>
	<el-dialog width="70%" :close-on-click-modal="false" title="审核" draggable v-model="visible">
		<el-card style="width: 100%; height: 400px; margin-bottom: 20px; box-sizing: border-box">
			<template #header>
				<div class="card-header">
					<span>代码名称</span>
				</div>
			</template>
			<el-scrollbar style="width: 100%; height: 280px">
				<pre><code v-html="url"></code></pre>
			</el-scrollbar>
		</el-card>
		<el-card style="width: 100%; height: 230px">
			<template #header>
				<div class="card-header">
					<span>审核结果</span>
				</div>
			</template>
			<el-row :gutter="24">
				<el-col :span="23" style="width: 100%; height: 100%">
					<el-input v-model="textarea" :readonly="readonly" style="width: 100%; height: 100%" :rows="6" type="textarea" placeholder="" />
				</el-col>
				<el-col :span="1">
					<div class="icon">
						<el-icon style="font-size: 20px; color: #999999; cursor: pointer" @click="getRefresh"><Refresh /></el-icon>
					</div>
					<div class="icon">
						<el-icon style="font-size: 18px; color: #999999; cursor: pointer" @click="getCopyDocument"><CopyDocument /></el-icon>
					</div>
				</el-col>
			</el-row>
		</el-card>
		<template #footer>
			<div class="dialog-footer">
				<el-button style="color: #009678" @click="readonly = false">编辑</el-button>
				<el-button style="background: #009678; color: #fff">确定</el-button>
			</div>
		</template>
	</el-dialog>
</template>

<script lang="ts" setup>
import { ref } from 'vue';

// 定义变量内容
const visible = ref(false);
const readonly = ref(true);
const textarea = ref('');
const url = `
SELECT  wk_order.cs_revst_wk_order_id    --95598回访工单标识
        ,wk_order.revst_wk_order_no    --被回访工单编号
        ,wk_order.mgt_org_code    --管理单位编码
        ,org.mgt_org_name    --管理单位名称
        ,org.prov_code    --省公司编码
        ,org.prov_name    --省公司名称
        ,org.city_code    --地市公司编码
        ,org.city_name    --地市公司名称
        ,org.county_code    --区县公司编码
        ,org.county_name    --区县公司名称
        ,org.branch_off_code    --分公司编码
        ,org.branch_off_name    --分公司名称
        ,org.pow_sup_station_code    --供电所编码
        ,org.pow_sup_station_name    --供电所名称
        ,wk_order.revst_stat    --回访状态
        ,wk_order.revst_bus_type    --回访业务类型
        ,wk_order.acpt_time    --业务受理时间
        ,wk_order.hndl_acmp_time    --处理完成时间
        ,wk_order.revst_cont    --回访内容
        ,wk_order.revst_contact    --回访联系人
        ,wk_order.revst_mode    --回访方式
        ,wk_order.contact_tel    --联系电话
        ,wk_order.revst_dur    --回访期限
        ,wk_order.plan_revst_stf    --计划回访人员
        ,wk_order.plan_retvisit_time    --计划回访时间
        ,wk_order.send_stat    --发送状态
        ,wk_order.revst_fail_times    --已回访失败次数
        ,wk_order.acpt_stsf    --受理满意度
        ,wk_order.hndl_stsf    --处理满意度
        ,rslt.cs_revst_rslt_id    --95598回访结果标识
        ,rslt.attach_id    --附件标识
        ,rslt.revst_org_code    --回访单位编码
        ,rslt.revst_dept    --回访部门
        ,rslt.revst_stf    --回访人员
        ,rslt.revst_time    --回访时间
        ,rslt.revst_succ_flag    --回访成功标志
        ,rslt.revst_reason    --回访失败原因
        ,rslt.revst_arr_time    --回访到达现场时间
        ,rslt.revst_cust_opn    --回访客户意见
FROM    pro_ods_js_cms2_prod.ods_db5_cs_revst_wk_order wk_order    --95598回访工单
LEFT JOIN pro_ods_js_cms2_prod.ods_db5_cs_revst_rslt rslt    --95598回访结果
ON      wk_order.cs_revst_wk_order_id = rslt.cs_revst_wk_order_id 
LEFT JOIN    js_js_dwd_proj_prod.dim_cst_gen_mgt_org org    --管理单位维表
ON      wk_order.mgt_org_code = org.mgt_org_code
`;

// 打开弹窗
const openDialog = (row: any) => {
	visible.value = true;
	console.log(row);
};

const getRefresh = () => {
	alert('刷新');
};

const getCopyDocument = () => {
	alert('复制');
};

// 暴露变量
defineExpose({
	openDialog,
});
</script>

<style lang="scss" scoped>
.icon {
	width: 100%;
	height: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
}
</style>
